body {
	margin: 0;
	background: #000; 
}
video { 
	/* fixed总以body为定位时的对象,总是根据浏览器的窗口来进行元素的定位 */
    position: fixed;
	/* 使其距离浏览器上边,左边距离浏览器50% */
    top: 50%;
    left: 50%;
	/* 设置段落的最小宽度,最小高度 */
    min-width: 100%;
    min-height: 100%;
	/* 设置子元素的宽度/高度+内边距+外边距+边框=父元素的宽度/高度 */
    width: auto;
    height: auto;
	/* 设置元素的堆叠顺序,使视频作为背景 */
    z-index: -100;
	/* 设置视频x轴,y轴的显示 */
    transform: translateX(-50%) translateY(-50%);
	/* 设置刚打开页面时出现的图片 */
	background: url(img/w1.jpg) no-repeat;
	background-size: cover;
	transition: 1s opacity;
}
/* 设置文字框部分的样式 */
#video { 
	font-family: Agenda-Light, Agenda Light, Agenda, Arial Narrow, sans-serif;
	font-weight:100; 
	background: rgba(0,0,0,0.3);
	color: white;
	padding: 2rem;
	width: 33%;
	margin:2rem;
	float: right;
	font-size: 1.2rem;
}
/* 设置"龙猫"字体部分 */
h1 {
	font-size: 3rem;
	text-transform: uppercase;
	margin-top: 0;
	letter-spacing: .3rem;
}
/* 设置"点击观看全片"按钮部分 */
#video button { 
	display: block;
	width: 80%;
	padding: .4rem;
	border: none; 
	margin: 1rem auto; 
	font-size: 1.3rem;
	background: rgba(255,255,255,0.23);
	color: #fff;
	border-radius: 3px; 
	cursor: pointer;
	transition: .3s background;
}
/* 设置hover样式 */
#videos button:hover { 
	background: rgba(0,0,0,0.5);
}
a {
	display: inline-block;
	color: #fff;
	text-decoration: none;
	background:rgba(0,0,0,0.5);
	padding: .5rem;
	transition: .6s background; 
}
a:hover{
	background:rgba(0,0,0,0.9);
}
/* 设置视口 */
@media screen and (max-width: 500px) { 
	div{width:70%;} 
}
@media screen and (max-device-width: 800px) {
	html { background: url(img/w1.jpg) #000 no-repeat center center fixed; }
	#lm { display: none; }
}